import { observer, useLocalObservable } from 'mobx-react'
import styles from './index.module.less'
import Store from '../store'
import { useEffect } from 'react'
import IconFont from '@/components/IconFont'
import { history } from 'umi'
import ScrollListView from '@/components/ScrollListView'
import { api } from '@/servers/api'
import { getData } from '@/servers/http'
import { getTrainingsRecords } from '../api'

const idTextMap = new Map([['1', '职业价值观']])

export default observer(() => {
    const store = useLocalObservable(() => Store)
    useEffect(() => {
        // getTestEvalsRecordList()
        document.title = '实训结果'
    }, [])

    const handleClick = (data: any) => {
        switch (data?.training_id) {
            case '1':
                history.push(`/auction/result/${data?.id}`)

            default:
                break
        }
    }

    return (
        <div className={styles.container}>
            <div className={styles.title}>实训结果</div>
            <ScrollListView
                requestApi={data => getTrainingsRecords(data)}
                noDataText={
                    <div className={styles.no_data}>
                        空空如也
                        <br />
                    </div>
                }
                render={data => {
                    return (
                        <div>
                            {data.map((item: any, idx: number) => {
                                return (
                                    <div className={styles.row_item} key={item.id} onClick={() => handleClick(item)}>
                                        <span className={styles.list_no}>{idx + 1}.</span>
                                        <span className={styles.list_time}>{item.create_time}</span>
                                        <span className={styles.list_type}>{item?.trainingInfo?.name}</span>
                                        <IconFont type="icon-zuojiantou" />
                                    </div>
                                )
                            })}
                        </div>
                    )
                }}
            />
        </div>
    )
})
